<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录</title>
		<link rel="stylesheet" href="css/denglu.css">
	</head>
	<body>
		<div class="title">
			<div class="title_logo"></div>
		</div>
		<div class="wrap">
			<div class="denglu_background">
				<div class="login_box">
					<div class="login_tab">
						<ul class="list">
							<li id="tabs" class="login_txtshow1">账号登录</li>
							<span class="login_txt_line"></span>
							<li id="tabs">扫码登录</li>
						</ul>
					</div>
					<div class="test">
						<div class="input_box input_show2" id="boxs">
							<input type="text" placeholder="邮箱/手机号码/小米ID">
							<input type="text" placeholder="密码">
							<div class="input_txt1">登录</div>
							<div class="input_txt2">手机短信登录/注册</div>
							<div class="input_txt_box">
								<span class="input_txt3"><a href="zhuce.html">立即注册</a></span>
								<span class="input_txt4">|</span>
								<span class="input_txt3">忘记密码？</span>
							</div>
							<div class="input_icon_box">
								<div class="input_icon1">
									<div class="input_icon1_bg1"></div>
								</div>
								<div class="input_icon2">
									<div class="input_icon1_bg2"></div>
								</div>
								<div class="input_icon3">
									<div class="input_icon1_bg3"></div>
								</div>
								<div class="input_icon4">
									<div class="input_icon1_bg4"></div>
								</div>
							</div>
						</div>
						<div class="input_box2" id="boxs">
							<div class="input_box2_img"></div>
							<div class="input_box2_box">
								<div class="input_box2_txt1">使用</div>
								<div class="input_box2_txt2">小米商城APP</div>
								<div class="input_box2_txt1">扫一扫</div>
							</div>
							<div class="input_box2_box2">
								<div class="input_box2_txt3">小米手机可打开「设置」>「小米帐号」扫码登录</div>
							</div>
						</div>
					</div>	
				</div>
			</div>
		</div>
		<div class="footbox">
			<div class="foot1">
				<ul>
					<li>简体</li>
					<span class="foot1_txt1">|</span>
					<li>繁体</li>
					<span class="foot1_txt1">|</span>
					<li>English</li>
					<span class="foot1_txt1">|</span>
					<li>常见问题</li>
					<span class="foot1_txt1">|</span>
					<li>隐私政策</li>
				</ul>
			</div>
			<div class="foot2">
				<p>小米公司版权所有-京ICP备10046444-</p><i></i><p style="cursor: pointer;">京公网安备11010802020134号</p><p>-京ICP证110507号</p>
			</div>
		</div>
		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js"></script>
		<script>
			var tabs = document.querySelectorAll("#tabs");
			var boxs = document.querySelectorAll("#boxs");
			for(var i=0;i<tabs.length;i++){
				tabs[i].setAttribute("index",i)
				tabs[i].onclick = function(){
					for(var j=0;j<tabs.length;j++){
						tabs[j].classList.remove("login_txtshow1");
						boxs[j].classList.remove("input_show2");
					}
					var index = this.getAttribute("index");
					tabs[index].classList.add("login_txtshow1");
					boxs[index].classList.add("input_show2")
				}
			}
			
			// console.log($("#tabs"))
			// $("#tabs").click(function(){
			// 	var index = $(this).index();
			// 	$(this).addClass('login_txtshow1').siblings().removeClass('login_txtshow1')
			// 	$('.test>div').eq(index).addClass('input_show2').siblings().removeClass('input_show2')
			// })
		</script>
	</body>
</html>
